import { IAlertOptions } from './typings';
import './styles/index.css';

class Template {
  //仅自身和子类使用
  /**
   * 创建alert插件视图模板
   * 如 <div>...</div>
   * @param {IAlertOptions} options 用户配置项
   * @returns {HTMLElement} oAlert 插件视图模板节点
   */
  protected alertView(options: IAlertOptions) {
    const { headerTitle, alertText } = options;
    const oAlert: HTMLElement = document.createElement('div');
    oAlert.className = 'alert';
    oAlert.innerHTML = `
      <div class="inner">
        <header class="alert-header">
          <h1>${headerTitle}</h1>
          <span class="icon">&times;</span>
        </header>
        <div class="alert-wrap">
          <p>${alertText}</p>
        </div>
      </div>
    `;

    return oAlert;
  }
}

export default Template;
